import 'dart:ffi';

import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';




class GHUserPage extends StatefulWidget {
  const GHUserPage({super.key});

  @override
  State<GHUserPage> createState() => _GHUserPageState();
}

class _GHUserPageState extends State<GHUserPage> {
  @override
  Widget build(BuildContext context) {
   return Scaffold(
    body: Stack(children: [
      Container(decoration: const BoxDecoration(image: DecorationImage(image:  AssetImage('images/home_bg_0.png'), fit: BoxFit.cover,), color: Color(0xFFF5F5F5)),),
      SafeArea(child: ListView(children: [
        bar(),
        const SizedBox(height: 20),
        phoneRow(),
        listView(),
        pesananItem(),
        itemListView()
      ],))
    ],)
   );
  }
}

Widget bar() {
    return const Row(children: [
      SizedBox(width: 16,),
      Expanded(
              flex: 0,
              child: Text('Bantuan Tunai', style: TextStyle(color: Colors.black, fontSize: 20, fontWeight: FontWeight.bold),),
            )
  ]);
}

Widget phoneRow() {
  return const Row(children: [
    SizedBox(width: 16),
    Image(image: AssetImage('images/logo.png'), width: 40, height: 40,),
    SizedBox(width: 16),
    Text('351****7123', style: TextStyle(fontSize: 16, fontWeight: FontWeight.bold))
  ]);
}

Widget listView() {
  return Container(padding: const EdgeInsets.only(left: 16, right: 16), child: SingleChildScrollView(child: Column(children: [
    statesView()
  ],)),);
}

Widget statesView() {
  return Container(
    margin: const EdgeInsets.only(left: 0, right: 0, top: 12),
    padding: const EdgeInsets.only(left: 12, right: 12, top: 10, bottom: 10),
    height: 102,
    decoration: const BoxDecoration(borderRadius: BorderRadius.all(Radius.circular(8)), color: Color(0xFFFF826C)),
    child: Column(children: [
      Row(children: [
        const Text('pesanan lewat waktu', style: TextStyle(color: Colors.white, fontWeight: FontWeight.bold, fontSize: 16)),
        const Spacer(),
        SizedBox(
          width: 120,
          height: 28,
          child: ElevatedButton(
          style: ButtonStyle(backgroundColor: MaterialStateProperty.all(Color(0xFFFEEEDB))),
          onPressed: (){}, 
          child: const Text('Pergi membayar', style: TextStyle(color: Color(0xFFF49B23), fontWeight: FontWeight.w900, fontSize: 8))),
        ),
      ],),
      // const Spacer(),
      const SizedBox(height: 10),
      const Text('Anda memiliki - pesanan yang telah jatuh tempo sebesar Rp25.000 yang harus dibayar', textAlign: TextAlign.left, style: TextStyle(color: Colors.white, fontSize: 12),)
    ],),
  );
}

Widget pesananItem() {
  return GestureDetector(
    onTap: () => {},
    child: Container(
    margin: const EdgeInsets.only(left: 16, right: 16, top: 12),
    padding: const EdgeInsets.only(left: 12, right: 12, top: 10, bottom: 10),
    height: 60,
    decoration: const BoxDecoration(borderRadius: BorderRadius.all(Radius.circular(8)), color: Colors.white),
    child: const Row(children: [
       Image(image: AssetImage('images/logo.png'), width: 38, height: 38),
        Text('Riwayat pesanan', style: TextStyle(color: Color(0xFFF49B23), fontSize: 14, fontWeight: FontWeight.bold),),
        Spacer(),
        Icon(Icons.chevron_right)
    ],),
  ),
  );
}

List itemInfos = [
  {"title":"Tentang kami", "icon":"images/user_icon_1.png", "tag":0},
  {"title":"Perjanjian Privasi", "icon":"images/user_icon_2.png", "tag":1},
  {"title":"Masukan", "icon":"images/user_icon_3.png", "tag":2},
  {"title":"Pengaturan", "icon":"images/user_icon_4.png", "tag":3},
  {"title":"借款合同", "icon":"images/user_icon_5.png", "tag":4},
];

Widget itemListView() {
  return Container(
    margin: const EdgeInsets.only(left: 16, right: 16, top: 12),
    padding: const EdgeInsets.only(left: 12, right: 12),
    height: 252,
    decoration: const BoxDecoration(borderRadius: BorderRadius.all(Radius.circular(8)), color: Colors.white),
    child: ListView.builder(
      physics: const NeverScrollableScrollPhysics(),
      itemCount: itemInfos.length,
      shrinkWrap: true,
      itemBuilder: (context, index) {
      return  Container(
        height: 52,
        padding: const EdgeInsets.only(top: 16),
        // color: Colors.red,
        child: Column(children: [
          Row(children: [
           Image(image: AssetImage(itemInfos[index]["icon"]), width: 20, height: 20),
           const SizedBox(width: 8),
            Text(itemInfos[index]["title"], style: TextStyle(color: Color(0xFF000000), fontSize: 14, fontWeight: FontWeight.w600),),
           const Spacer(),
            const Icon(Icons.chevron_right),
         ],),
         Spacer(),
    Container(height: 1, color: const Color(0xFFF0F2F9),),
        ],)
      );
    },),
  );
}